<template>
  <node
    title="发起人"
    :show-error="showError"
    :is-root="true"
    :content="content"
    :isShowText="isShowText"
    @selected="$emit('selected')"
    @insertNode="(type) => $emit('insertNode', type)"
    :placeholder="processType === 'payrollCredit' ? '发起人设置' : '不可设置'"
    header-bgc="#576a95"
    header-icon="el-icon-user-solid"
    :useable="processType === 'payrollCredit'"
  />
</template>

<script>
import Node from "./Node";
import { mapState } from "vuex";
export default {
  name: "RootNode",
  components: { Node },
  props: {
    config: {
      type: Object,
      default: () => {
        return {};
      },
    },
  },
  computed: {
    ...mapState(['processType']),
    content() {
      if (this.config.props.assignedUser.length > 0) {
        let texts = [];
        this.config.props.assignedUser.forEach((org) => texts.push(org.name));
        return String(texts).replace(/,/g, "、");
      } else {
        return "";
      }
    },
    isShowText() {
      const config = this.config.props;
      if (config.isShow === '1') {
        return '可见明细金额';
      } else if (config.isShow === '0') {
        return '不可见明细金额';
      } else {
        return '设置明细金额是否可见';
      }
    }
  },
  data() {
    return {
      showError: false,
      errorInfo: "",
    };
  },
  methods: {
    // 校验数据配置的合法性
    validateSelf() {
      let flag = true;
      this.showError = false;
      if (this.processType) {
        if (this.processType === 'payrollCredit') {
          if (['0', '1'].includes(this.config.props.isShow)) {
            flag = true;
          } else {
            flag = false;
          }
        } else {
          flag = true;
        }
      } else {
        flag = true;
      }
      console.log('flag===>发起人', flag);
      this.showError = !flag;
      return flag;
    },
  },
};
</script>

<style scoped></style>
